<template>
  <div>
    <zm-panel
      :visible.sync="value"
      @change="closeAfter"
      :show-footer="false"
    >
    <div slot="title">
        <div class="dib">{{ infoData.name }}</div>
        <tag-type
          :value="linkInfo.linkStatus || infoData.checkStatus"
          :msg="linkInfo.linkStatusMsg"
        />
      </div>
        <app-block v-if="isApproval&&isShowApproveBtn" class="optionBtn">
          <template class="vm">
              <zm-button @click="onEdit" plain v-if="+linkInfo.isEdit === 1 && isWaitMe === '1'">
                {{ isPlanConfig ? "编辑" : "修改" }}
              </zm-button>
              <zm-button
                @click="onApproved('0')"
                type="danger"
                v-if="+linkInfo.isAction === 1 && isHiddenApproveBtn"
                plain
              >
                审批驳回
              </zm-button>
              <zm-button
                @click="onApproved('1')"
                v-if="+linkInfo.isAction === 1 && isHiddenApproveBtn"
                type="success"
                plain
              >
                审批通过
              </zm-button>
              <zm-button @click="onRevocation" v-if="showBackBtn" plain type="info">
                撤销审批
              </zm-button>
              <zm-button @click="onSubmit" plain v-if="showSubmit">
                提交审批
              </zm-button>
            </template>
        </app-block>
        <app-block>
          <zm-tabs
            class="mb15"
            :list="titleList"
            v-model="activeTab"
            tab-type=""
          ></zm-tabs>
          <components
            :is="activeTab"
            :info-data="infoData"
            :process-type="processType"
            :business-id="specialID || id"
            :draft-id="specialDraftID || draftId"
            :is-load-list="isLoadList"
            :check-status="infoData.checkStatus"
          ></components>
        </app-block>
    </zm-panel>
    <!-- 编辑特殊节假日 -->
    <set-special-rule
      v-model="specialRuleParams.visible"
      v-if="specialRuleParams.visible"
      :id="specialRuleParams.id"
      :params="specialRuleParams.params"
      :is-approval="isApproval"
      @re-load="getInfo"
    ></set-special-rule>
    <!-- 审批操作弹窗 -->
    <approve-input
      v-model="showApproveDialog"
      v-if="showApproveDialog"
      @after-approve="afterApprove"
      ref="approveDialog"
      :type="approveObj.approveType"
    ></approve-input>
  </div>
</template>
<script>
import panelMixin from '@/mixins/panelMixin'
import { fourTabs, oneTabs } from './const'
import TagType from '@/components/TagType'
import BaseMsg from './components/BaseMsg'
import OperatLog from './components/OperatLog'
import SaleOrder from './components/SaleOrder'
import Record from '@/views/approval/components/Record'
import SetSpecialRule from '../SetSpecialRule'
import productProgramApis from '@/api/src/productProgram'
import approveMixin from '@/mixins/approveMixin'
import approveApi from '@/api/src/approve'
import { PROCESS_TYPE } from '@/model'
import ApproveInput from '@/components/ApproveInput'

export default {
  name: 'Detail',
  components: {
    TagType,
    BaseMsg,
    OperatLog,
    SaleOrder,
    Record,
    SetSpecialRule,
    ApproveInput
  },
  mixins: [panelMixin, approveMixin],
  provide () {
    return {
      $detail: this
    }
  },
  props: {
    id: {
      type: String,
      default: ''
    },
    draftId: {
      type: String,
      default: ''
    },
    // 是否为已售方案产品
    isSoldProduct: Boolean,
    // 是否为方案配置，控制按钮
    isPlanConfig: Boolean,
    isShowBtn: {
      // 是否展示按钮
      type: Boolean,
      default: true
    }
  },
  data () {
    return {
      activeTab: 'BaseMsg',
      infoData: {},
      linkInfo: {},
      loading: true,
      specialRuleParams: {
        visible: false
      },
      // 特殊方案需取审批通过或审批驳回接口返回的ID去获取审批记录
      specialID: '',
      specialDraftID: ''
    }
  },
  computed: {
    titleList () {
      const res = this.isSoldProduct ? fourTabs() : oneTabs()
      return res
    },
    processType () {
      return this.isSoldProduct
        ? PROCESS_TYPE.specPrice
        : PROCESS_TYPE.saleOrderSpecialConfig
    },
    // 撤销审批 审批中+发起人
    showBackBtn () {
      return (
        +this.linkInfo.isSponsor === 1 &&
        +this.linkInfo.linkStatus === 1
      )
    },
    approveObj: {
      get () {
        let params = {
          businessId: this.id,
          draftId: this.draftId,
          processType: this.processType,
          approveType: '0' // 通过 或 驳回
        }
        if (this.processType === PROCESS_TYPE.saleOrderSpecialConfig) { params.draftId = this.draftId }
        return params
      },
      set () {
        console.log('approveObj set')
      }
    },
    showSubmit () {
      // 发起人且审批状态不是已通过和审批中
      return +this.linkInfo.isSponsor === 1 && (+this.linkInfo.linkStatus !== 3 && +this.linkInfo.linkStatus !== 1)
    }
  },
  watch: {},
  created () {
    this.getInfo()
  },
  methods: {
    // 获取详情
    async getInfo () {
      this.infoData = await productProgramApis.getInfo({ id: this.id, draftId: this.draftId })
      if (!this.isShowBtn) {
        return
      } else {
        await this.getLinkStatus()
      }
    },
    async getLinkStatus () {
      this.linkInfo = await approveApi.getLinkStatus({
        businessId: this.id,
        processType: this.processType,
        linkName: this.infoData.name,
        draftId: this.draftId
      })
    },
    onEdit () {
      this.specialRuleParams = {
        visible: true,
        id: this.id,
        params: {
          draftId: this.draftId,
          isApproval: '1'
        }
      }
    },
    async onDel () {
      await productProgramApis.delete({ id: this.id })
      this.$message.success('删除成功')
      this.close()
      this.$emit('re-load')
    },
    async onSubmit () {
      await approveApi.submit({
        processType: this.processType,
        businessId: this.infoData.id,
        linkName: this.infoData.name,
        draftId: this.draftId
      })
      this[this.initMethodsKey]()
      this.isLoadList = !this.isLoadList
      this.$emit('after-save')
      this.$message.success('操作成功')
    }

  }
}
</script>
<style scoped lang='scss'>
</style>
